<template>
	<el-dialog title="反馈详情" :visible.sync="visible" append-to-body width="992px">
		<div class="feedback_detail_wrapper">
			<div class="header">
				<span class="info">反馈人：{{ data.userName }}</span>
				<span class="info">时间：{{ data.createTime }}</span>
				<span class="info">
					评分：
					<el-rate v-model="data.filed1" show-text disabled></el-rate>
				</span>
			</div>
			<div class="content" v-html="data.content"></div>
		</div>
	</el-dialog>
</template>

<script>
export default {
	props: {
		value: { type: Boolean, default: false },
		data: { type: Object, default: () => {} }
	},
	data() {
		return {
			visible: this.value
		};
	},
	watch: {
		value(flag) {
			this.visible = flag;
		},
		visible(flag) {
			this.$emit('input', flag);
		}
	},
	methods: {}
};
</script>

<style lang="scss" scoped>
.feedback_detail_wrapper {
	flex: 1;
	&:deep(.header) {
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0 16px 16px;
		border-bottom: solid 1px #ebeef5;
		span.info {
			display: flex;
			margin: 0 24px;
		}
		.el-rate__text {
			color: #909399 !important;
		}
	}
	&:deep(.content) {
		padding: 16px;
		font-size: 16px;
		line-height: 2em;
		min-height: calc(70vh - 170px);
		img {
			max-width: 100%;
		}
	}
}
</style>
